{{ define "comment" }}
<div id="comment_{{ .ID }}" class="flex items-start mb-4 space-x-4 w-auto bg-white dark:bg-gray-800 p-4 rounded-xl bg-gray-100 dark:bg-gray-700 dark:text-white border-2 border-gray-300 dark:border-gray-600">
    <a href="#">
        <img src="/assets/static/img/placeholder.png" alt="Profile Image" class="flex max-w-12 m-2 rounded-xl flex-shrink-0">
    </a>
    <div class="flex flex-col items-start gap-2">
        <a href="#">
            <b class="text-left text-2xl">{{ .Username }}</b>
        </a>
        <p id="comment_text_{{ .ID }}" class="text-left"></p>
        <p id="comment_date_{{ .ID }}" class="text-left text-sm">{{ .Date }}</p>
    </div>
</div>
<script>
    document.getElementById("comment_text_{{ .ID }}").innerHTML = marked.parse("{{ .Comment }}");
</script>
{{ end }}